<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="/static/component/pear/css/pear.css" />
    <script src="/static/component/layui/layui.js"></script>
    <script src="/static/component/pear/pear.js"></script>
</head>

<body>
    <form class="layui-form" action="">
        <div class="mainBox">
            <div class="main-container">
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        区服
                    </label>
                    <div class="layui-input-block">
                        <select name="serverid" id="serverid" lay-search>
                            <option value="">服务器ID(可输入后选择)</option>
                            {volist name="ServerLs" id="server"}
                            <option value="{$server.sid}">{$server.name}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        玩家账号
                    </label>
                    <div class="layui-input-block">
                        <input type="text" class="layui-input layui-form-danger" name="account" id="account" type="text"
                            value="{$model['account']??""}" />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        角色名称
                    </label>
                    <div class="layui-input-block">
                        <select name="actorid" id="actorid" lay-search>
                            <option value=""></option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        允许状态
                    </label>
                    <div class="layui-input-block">
                        <input type="number" class="layui-input layui-form-danger" id="allowstatus" name="allowstatus" type="text"
                            value="2" />
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">
                        允许数量
                    </label>
                    <div class="layui-input-block">
                        <input type="number" class="layui-input layui-form-danger" name="maxsellnum" type="text"
                            value="10" />
                    </div>
                </div>
            </div>
        </div>
        <div class="bottom">
            <div class="button-container">
                <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit="" lay-filter="save">
                    <i class="layui-icon layui-icon-ok"></i>
                    提交
                </button>
                <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
                    <i class="layui-icon layui-icon-refresh"></i>
                    重置
                </button>
            </div>
        </div>
    </form>
    <script>
        layui.use(['form', 'jquery', 'layedit', 'uploads'], function () {
            let form = layui.form;
            let $ = layui.jquery;
            let layedit = layui.layedit
            layedit.set({
                uploadImage: {
                    url: "{$Request.root}/index/upload"
                }
            });
            //建立编辑器

            form.on('submit(save)', function (data) {

                // var allowstatus = $('#allowstatus').val();
                // if (allowstatus.trim() === "" || allowstatus.trim() === undefined) {
                //     layer.msg('选状态  大哥！');
                //     return
                // }

                $.ajax({
                    data: JSON.stringify(data.field),
                    dataType: 'json',
                    contentType: 'application/json',
                    type: 'post',
                    success: function (res) {
                        //判断有没有权限
                        if (res && res.code == 999) {
                            layer.msg(res.msg, {
                                icon: 5,
                                time: 2000,
                            })
                            return false;
                        } else if (res.code == 200) {
                            layer.msg(res.msg, { icon: 1, time: 1000 }, function () {
                                parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
                                parent.layui.table.reload("dataTable");
                            });
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    }
                })
                return false;
            });



            function getActors() {
                var actorname = $('#account').val();
                var serverid = $("select[name='serverid']").val();
                if (serverid.trim() === "") {
                    layer.msg("请先填写区服名称！！！");
                    return
                }
                if (actorname.trim() === "") {
                    layer.msg("请先填写账号！！！");
                    return
                }
                actorname = actorname.trim();
                $.post('queryuname', { actorname: actorname, serverid: serverid }, function (res) {
                    //判断有没有权限
                    if (res && res.code == 999) {
                        layer.msg(res.msg, {
                            icon: 5,
                            time: 2000,
                        })
                        return false;
                    } else if (res.code == 200) {
                        // 清空下拉框中的所有选项
                        $("#actorid").empty();
                        // 遍历data数组并添加选项
                        res.data.forEach(function (item) {
                            $("#actorid").append(
                                '<option value="' + item.actorid + '">' + item.actorname + '</option>'
                            );
                        });
                        // 使用layui的下拉框模块进行渲染
                        layui.form.render('select');
                        return false;
                    } else {
                        layer.msg(res.msg)
                        console.log(res.msg)
                    }
                })

            }
            $("#account").on("input", function (e) {
                console.log('intput')
                //获取input输入的值
                var value = e.delegateTarget.value;
                if (value != null && value != '') {
                    getActors();
                }
            })
        })
    </script>
</body>

</html>